<template>
    <div>
        <Spin fix v-if="isSpin">
            <Icon type="ios-loading" size=18 class="demo-spin-icon-load"></Icon>
            <div>正在单位隐患表，请稍后</div>
        </Spin>
        <Form :label-width="100" ref="formInline" :model="formInline">
            <div v-if="switchFlag">
                <Row :gutter="16" class="query-form" >
                    <i-col span="8">
                      <FormItem label="二级集团：" prop="twoLevelOrgName">
                        <two-level-org org-code v-model="formInline.twoLevelOrgName" ></two-level-org>
                      </FormItem>
                    </i-col>

                    <i-col span="8">
                        <FormItem label="单位名称：" prop="operatorOrgId">
                          <company-select v-model="formInline.orgName"></company-select>
                        </FormItem>
                    </i-col>
                    <i-col span="8">
                    <FormItem label="隐患等级：" prop="hidLevel">
                      <CheckboxGroup v-model="formInline.hidLevel">
                        <Checkbox v-for="(item, index) in levelList" :key="index" :label="item.id">{{item.label}}</Checkbox>
                      </CheckboxGroup>
                    </FormItem>
                  </i-col>

                </Row>
                <Row :gutter="16" class="query-form2">
                  <i-col span="8">
                    <FormItem label="上报人：" prop="userName">
                      <Input v-model="formInline.userName" placeholder="请填写上报人"/>
                    </FormItem>
                  </i-col>
                    <i-col span="8">
                        <FormItem label="创建时间：" prop="se_date">
                            <DatePicker type="daterange" v-model="formInline.se_date" placement="bottom-end" placeholder="请选择上报时间（开始，结束）" style="width: 100%"></DatePicker>
                        </FormItem>
                    </i-col>
                    <i-col span="8">
                        <FormItem label="审批状态：" prop="se_date">
                            <Select v-model="formInline.status">
                                <Option v-for="(item, index) in statusList" :value="item.id" :key="index">{{item.label}}</Option>
                            </Select>
                        </FormItem>
                    </i-col>
                </Row>
                <Row :gutter="16" class="query-form2">
                  <i-col span="8">
                    <FormItem label="整改状态：">
                      <Select v-model="formInline.generateType">
                        <Option value="1" >正常</Option>
                        <Option value="2" >超时</Option>
                        <Option value="3" >待定</Option>
                      </Select>
                    </FormItem>
                  </i-col>
                    <i-col span="16">
                        <div style="float: right;">
                            <Button class="ivu-btn-query"  icon="md-search"  @click="query">查询</Button>
                            <Button class="ivu-btn-reset" style="margin-left: 10px" @click="cancel">重置</Button>
                            <Button @click="switchQuery(false)" style="margin-left: 10px" class="ivu-btn-switch2" type="text" >收起<Icon type="ios-arrow-up" /></Button>
                        </div>
                    </i-col>
                </Row>
            </div>
            <div v-else>
                <Row :gutter="16" class="query-form2">
                    <i-col span="8">
                      <FormItem label="二级集团：" prop="twoLevelOrgName">
                        <two-level-org org-code v-model="formInline.twoLevelOrgName" ></two-level-org>
                      </FormItem>
                    </i-col>
                    <i-col span="8">
                      <FormItem label="单位名称：" prop="operatorOrgId">
                        <company-select v-model="formInline.orgName"></company-select>
                      </FormItem>
                    </i-col>
                    <i-col span="8">
                        <div style="float: right;">
                            <Button class="ivu-btn-query"  icon="md-search"  @click="query">查询</Button>
                            <Button class="ivu-btn-reset" style="margin-left: 10px" @click="cancel">重置</Button>
                            <Button @click="switchQuery(true)" style="margin-left: 5px" class="ivu-btn-switch2" type="text" >展开<Icon type="ios-arrow-down"/></Button>
                        </div>
                    </i-col>
                </Row>
            </div>
        </Form>
        <Row type="flex" justify="start" class="query-form">
            <i-col>
                <Button icon="md-cloud-download" class="ivu-btn-add" @click="exportExcel">导出</Button>
            </i-col>
        </Row>
        <Table ref='table' style="margin-top: 10px" :loading="loading" border :columns="columns" @on-sort-change="querySort"
               :data="infos" width="100%" :height="tableHeight" highlight-row stripe size="small"></Table>
        <Row type="flex" justify="end" >
            <i-col>
                <Page :total="pagedata.total" :current="pagedata.currentPage" :page-size="pagedata.pageSize"
                      @on-page-size-change="pageSizeChange" @on-change="pageChange" :page-size-opts="pageSizeArray" show-total show-sizer show-elevator />
            </i-col>
        </Row>
        <Modal v-model="modal1" width="800" :mask-closable="false">
            <Tabs>
                <TabPane label="延期表单">
                    <Form ref="formCustom" :model="formData" :rules="ruleCustom" label-position="top">
                        <Row>
                            <i-col i-col="8">
                                <FormItem label="延期天数：" prop="days">
                                    <!--                                precision="0"-->
                                    <InputNumber v-model="formData.days" ></InputNumber>
                                </FormItem>
                            </i-col>
                        </Row>
                        <Row>
                            <i-col span="24">
                                <FormItem label="延期原因：" prop="reason">
                                    <Input v-model="formData.reason" placeholder="请填写延期原因" type="textarea" :rows="4"/>
                                </FormItem>
                            </i-col>
                        </Row>
                    </Form>
                </TabPane>
                <TabPane label="延期记录">
                    <Table ref='table2' :loading="loading2" border :columns="postponeColumns"
                           :data="infos2" width="100%" :height="300" highlight-row stripe size="small"></Table>
                    <Row type="flex" justify="end" >
                        <i-col>
                            <Page :total="pagedata.total2" :current="pagedata.currentPage2" :page-size="pagedata.pageSize2"
                                  @on-page-size-change="pageSizeChange2" @on-change="pageChange2" :page-size-opts="pageSizeArray" show-total show-sizer show-elevator />
                        </i-col>
                    </Row>
                </TabPane>
            </Tabs>
            <div slot="footer">
                <Button @click="saveInfo" class="ivu-btn-save" :loading="buttonLoading">确定</Button>
                <Button @click="modal1 = false" class="ivu-btn-cancel" >取消</Button>
            </div>
        </Modal>
        <Modal v-model="modal2" width="800" :mask-closable="false">
            <Tabs>
                <TabPane label="基础信息">
                    <Form :label-width="160">
                        <Row >
                            <i-col>
                                <FormItem label="排查对象：">
                                    {{formData.projectname}}
                                </FormItem>
                            </i-col>
                        </Row>
                        <Row class="code-row-bg2">
                            <i-col>
                                <FormItem label="隐患分类：" >
                                    {{formData.apItemType == null? '自定义隐患' : formData.type+'>>'+formData.itemType+'>>'+formData.apItemType}}
                                </FormItem>
                            </i-col>
                        </Row>
                        <Row :gutter="16">
                            <i-col span="8">
                                <FormItem label="隐患编号：" >
                                    {{formData.name}}
                                </FormItem>
                            </i-col >
                            <i-col  span="8">
                                <FormItem label="隐患级别：">
                                    {{formData.level}}
                                </FormItem>
                            </i-col>
                            <i-col  span="8">
                                <FormItem label="整改期限（天）：" >
                                    {{formData.recPeriod}}
                                </FormItem>
                            </i-col>
                        </Row>
                        <Row  class="code-row-bg2">
                            <i-col>
                                <FormItem label="排查条目：" >
                                    {{formData.content}}
                                </FormItem>
                            </i-col>
                        </Row>
                        <Row>
                            <i-col>
                                <FormItem label="排查内容描述：">
                                    {{formData.remark}}
                                </FormItem>
                            </i-col>
                        </Row>
                        <Row class="code-row-bg2">
                            <i-col>
                                <FormItem label="整改记录：" >
                                    {{formData.rectifyrecord}}
                                </FormItem>
                            </i-col >
                        </Row>
                        <Row :gutter="16">
                            <i-col span="12">
                                <FormItem label="整改责任人：" >
                                    {{formData.rectifyrp}}
                                </FormItem>
                            </i-col >
                            <i-col  span="12">
                                <FormItem label="整改完成时间：">
                                    {{formData.governTimeStr}}
                                </FormItem>
                            </i-col>
                        </Row>
                    </Form>
                </TabPane>
                <TabPane label="附件图片">
                    <div style="height: 400px; overflow-y: auto; overflow-x: hidden">
                        <Row>
                            <i-col>

                                <Divider>隐患图片</Divider>
                                <!-- <div v-if="reportFile.length != 0">
                                    <img v-for="(item, index) in reportFile" :src="item.picture" :key="index" style="width: 100px; height: 100px; margin: 10px"/><br/>
                                </div> -->
								<div v-if="reportFile.length != 0">
								    <div v-for="(item, index) in reportFile" :key="index">
								        <router-link target="_blank" :to="{path:'/imgDetails',query:{id:item.id}}">
								            <img  :src="item.picture"  style="width: 100px; height: 100px; margin: 10px"/>
								        </router-link>
								    </div>
								</div>
                                <p v-else>暂无图片</p>
                            </i-col>
                        </Row>
                        <Divider>治理图片</Divider>
                        <Row>
                            <i-col>
                                <!-- <div v-if="modifyFile.length != 0">
                                    <div v-for="(item, index) in modifyFile" :key="index" style="float: left;width: 100px;">
                                        <img  :src="item.picture" style="width: 100px; height: 100px; margin: 10px"/>
                                    </div>
                                </div> -->
								<div v-if="modifyFile.length != 0">
								    <div v-for="(item, index) in modifyFile" :key="index">
								        <router-link target="_blank" :to="{path:'/imgDetails',query:{id:item.id}}">
								            <img  :src="item.picture"  style="width: 100px; height: 100px; margin: 10px"/>
								        </router-link>
								    </div>
								</div>
                                <p v-else>暂无图片</p>
                            </i-col>
                        </Row>
                    </div>
                </TabPane>
            </Tabs>
            <div slot="footer">
                <Button @click="modal2=false"  class="ivu-btn-save">关闭</Button>
            </div>
        </Modal>
        <Modal v-model="modal3" width="900" :mask-closable="false">
            <Tabs>
                <TabPane label="历史记录">
                    <Table ref='table3' :loading="loading3" border :columns="historyColumns" style="margin-top: 0px"
                           :data="infos3" width="100%" :height="500" highlight-row stripe size="small"></Table>
                </TabPane>
                <TabPane label="流程图">
                    <div style="height: 500px; overflow-y: auto; overflow-x: auto">
                        <img :src="imgUrl" @load='loadImg'>
                    </div>
                </TabPane>
            </Tabs>
            <div slot="footer" >
                <Button @click="modal3=false" class="ivu-btn-save">关闭</Button>
            </div>
        </Modal>
        <Modal v-model="modal4" width="900" :mask-closable="false" title="用户列表" :footer-hide="true">
            <Form ref="form2" :model="form2" :label-width="80">
                <Row>
                    <Col span="8">
                        <FormItem label="姓名:">
                            <Input type="text" v-model="form2.userName" style="width: 100%"></Input>
                        </FormItem>
                    </Col>
                    <Col span="8">
                        <FormItem label="机构：">
                            <Input type="text" v-model="form2.orgName" style="width: 100%"></Input>
                        </FormItem>
                    </Col>
                    <Col span="8">
                        <div style="float: right;">
                            <Button icon="md-search" type="error" style="margin-left: 8px" @click="queryUser">查询</Button>
                            <Button @click="reset" style="margin-left: 8px">重置</Button>
                        </div>

                    </Col>
                </Row>
            </Form>
            <Table ref='table4' style="margin-top: 0px" :loading="loading4" border :columns="userColumns"
                   :data="infos4" width="100%" :height="450" highlight-row stripe size="small"></Table>
            <Row type="flex" justify="end" >
                <i-col>
                    <Page :total="pagedata.total3" :current="pagedata.currentPage3" :page-size="pagedata.pageSize3"
                          @on-page-size-change="pageSizeChange3" @on-change="pageChange3" :page-size-opts="pageSizeArray" show-total show-sizer show-elevator />
                </i-col>
            </Row>
        </Modal>
    </div>
</template>

<script>
    import {formatDate} from '@/tools/index'
    import {Api} from '../../../api'
    var cascaderDom = () => import('@/components/cascader-dom.vue');
    import {sessionStorage} from '@/common/cacheUtils.js';

    export default {
        components:{
            cascaderDom
        },
        data(){
            return{
                isSpin: false,
                form2: {},
                loading3: false,
                rootOrgId: '',
                imgUrl: '',
                buttonLoading: false,
                switchFlag: false,
                loading: false,
                loading2: false,
                tableHeight: '',
                formInline: {
                    se_date: []
                },
                modal1: false,
                modal2: false,
                modal3: false,
                modal4: false,
                pagedata: {
                    total: 0,
                    pageSize: 10,
                    currentPage: 1,
                    total2: 0,
                    pageSize2: 10,
                    currentPage2: 1,
                    total3: 0,
                    pageSize3: 10,
                    currentPage3: 1,
                },
                pageSizeArray: [10, 20, 50],
                columns: [
                    {
                        type: 'index',
                        title: '序号',
                        width: 80,
                        align: 'center',
                        fixed: 'left',
                    },
                    {
                        title: '状态',
                        align: 'center',
                        key: 'status',
                        minWidth: 80,
                        render:(h,params)=>{
                            let color = 'green';
                            if(params.row.status == undefined || params.row.status == null){
                                color = 'red';
                            }
                            return h('div', [
                                h('span', {
                                    style: {
                                        color: color
                                    }
                                },params.row.status == 1 ? '审批中': params.row.status == 2 ? '被退回': params.row.status == 3 ? '已消除': '未上报' || '--')
                            ]);
                        }
                    },
                    {
                        title: '隐患流水号',
                        align: 'center',
                        key: 'flowNo',
                        minWidth: 200,
                        render:(h,params)=>{
                            return h('div',[
                                h('span',params.row.flowNo || '--')
                            ]);
                        }
                    },
                    {
                        title: '排查对象',
                        align: 'center',
                        key: 'existOrgId',
                        minWidth: 150,
                        render:(h,params)=>{
                            return h('div',[
                                h('span', params.row.parentOrgName + '>>' + params.row.projectname || '--')
                            ]);
                        }
                    },
                    {
                        title: '所属二级集团',
                        align: 'center',
                        key: 'existOrgId',
                        minWidth: 150,
                        render:(h,params)=>{
                            return h('div',[
                                h('span', params.row.twoLevelOrgName || '--')
                            ]);
                        }
                    },
                    {
                        title: '所属公司',
                        align: 'center',
                        key: 'existOrgId',
                        minWidth: 150,
                        render:(h,params)=>{
                            return h('div',[
                                h('span', params.row.parentOrgName || '--')
                            ]);
                        }
                    },
                    {
                        title: '隐患等级',
                        align: 'center',
                        key: 'level',
                        minWidth: 100,
                        render:(h,params)=>{
                            return h('div',[
                                h('span',params.row.level || '--')
                            ]);
                        }
                    },
                    {
                        title: '期限',
                        align: 'center',
                        key: 'recPeriod',
                        minWidth: 80,
                        render:(h,params)=>{
                            return h('div',[
                                h('span',params.row.recPeriod || '--')
                            ]);
                        }
                    },
                    {
                        title: '隐患分类',
                        align: 'center',
                        key: 'recPeriod',
                        minWidth: 150,
                        render:(h,params)=>{
                            return h('div',[
                                h('span', params.row.apItemType == null? '自定义隐患' : params.row.type+'>>'+params.row.itemType+'>>'+params.row.apItemType || '--')
                            ]);
                        }
                    },
                    {
                        title: '上报人',
                        align: 'center',
                        key: 'userName',
                        minWidth: 100,
                        render:(h,params)=>{
                            return h('div',[
                                h('span',params.row.userName || '--')
                            ]);
                        }
                    },
                    {
                        title: '上报时间',
                        align: 'center',
                        key: 'governTime',
                        sortable: 'custom',
                        minWidth: 150,
                        render: this.renderCellDateTime
                    },
                    {
                        title: '整改完成时间',
                        align: 'center',
                        key: 'completionDate',
                        sortable: 'custom',
                        minWidth: 150,
                        render:(h,params)=>{
                            return h('div',[
                                h('span',params.row.completionDate || '--')
                            ]);
                        }
                    },
                    {
                        title: '流程待办人',
                        align: 'center',
                        key: 'procinstUserName',
                        minWidth: 150,
                        render:(h,params)=>{
                            return h('div',[
                                h('span',params.row.procinstUserName || '--')
                            ]);
                        }
                    },
                    {
                        title: '整改限定时间',
                        align: 'center',
                        key: 'governTimeStr',
                        minWidth: 150,
                        render:(h,params)=>{
                            return h('div',[
                                h('span',params.row.governTimeStr || '--')
                            ]);
                        }
                    },
                    {
                        title: '整改状态',
                        align: 'center',
                        key: 'createTimeStr',
                        minWidth: 100,
                        render:(h,params)=>{
                            let governstate = '--';
                            let color = '';
                            if(params.row.status == '1' || params.row.status == '2'){
                                let governTimeStr = params.row.governTimeStr;
                                if(governTimeStr != null){
                                    governTimeStr = governTimeStr.substring(0,19);
                                    governTimeStr = governTimeStr.replace(/-/g,'/');
                                    let governTime = new Date(governTimeStr);
                                    if(new Date()>governTime){
                                        governstate = '超时';
                                        color = 'red'
                                    }else{
                                        governstate = '正常';
                                        color = 'green'
                                    }
                                }
                            }else if(params.row.status == '3'){
                                let governTimeStr = params.row.governTimeStr;
                                governTimeStr = governTimeStr.substring(0,19);
                                governTimeStr = governTimeStr.replace(/-/g,'/');
                                let governTime = new Date(governTimeStr);

                                let completionTimeStr = params.row.completionDate;
                                completionTimeStr = completionTimeStr.substring(0,19);
                                completionTimeStr = completionTimeStr.replace(/-/g,'/');
                                let completionTime = new Date(completionTimeStr);




                                if(completionTime>governTime ){
                                    governstate = '超时';
                                    color = 'red'
                                }else{
                                    governstate = '正常';
                                    color = 'green'
                                }

                                // if(params.row.score  >params.row.recPeriod ){
                                //     governstate = '超时';
                                //     color = 'red'
                                // }else{
                                //     governstate = '正常';
                                //     color = 'green'
                                // }
                            }
                            return h('div', [
                                h('span', {
                                    style: {
                                        color: color
                                    }
                                },governstate)
                            ]);
                        }
                    },
                    {
                        title: '操作',
                        align: 'center',
                        key: 'view',
                        fixed: 'right',
                        minWidth: 260,
                        render: (h, params) => {
                            let ifDelete = false;
                            let userRole = sessionStorage('userId').getObject('userId').userRole;
                            userRole.forEach((role) =>{
                                if(role.roleId == '73b38b37dff64392ba0ee7dd579bf293') ifDelete = true;
                            })


                            return h('div', [
                                h('A', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        fontSize: '14px'
                                    },
                                    on: {
                                        click: () => {
                                            this.modal2 = true;
                                            this.updateRow(params.row);
                                        }
                                    }
                                }, '详情'),
                                h('Divider', {
                                    props: {
                                        type: 'vertical',
                                    }
                                }, ''),
                                h('A', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        fontSize: '14px',
                                        color: params.row.status == "1" || params.row.status == "2" ? '' : '#d0d0d0',
                                        pointerEvents: params.row.status == "1" || params.row.status == "2"  ? '' : 'none'
                                    },
                                    on: {
                                        click: () => {
                                            this.selectRow = params.row;
                                            this.queryPostpone();
                                            this.modal1 = true;
                                        }
                                    }
                                }, '延期'),
                                h('Divider', {
                                    props: {
                                        type: 'vertical',
                                    }
                                }, ''),
                                h('A', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        fontSize: '14px',
                                        color: params.row.status == "1" || params.row.status == "2" ? '' : '#d0d0d0',
                                        pointerEvents: params.row.status == "1" || params.row.status == "2"  ? '' : 'none'
                                    },
                                    on: {
                                        click: () => {
                                            this.modal4 = true;
                                            this.selectRow = params.row;
                                            this.queryUser();
                                        }
                                    }
                                }, '委办'),
                                h('Divider', {
                                    props: {
                                        type: 'vertical',
                                    }
                                }, ''),
                                h('A', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        fontSize: '14px',
                                        color: params.row.status == "1" || params.row.status == "2" || params.row.status == "3" ? '' : '#d0d0d0',
                                        pointerEvents: params.row.status == "1" || params.row.status == "2" || params.row.status == "3" ? '' : 'none'
                                    },
                                    on: {
                                        click: () => {
                                            this.imgUrl = Api.getFlowImg + '/' + params.row.procinstId
                                            this.queryHistory(params.row);
                                            this.modal3 = true;
                                        }
                                    }
                                }, '流程图'),
                                // h('Divider', {
                                //     props: {
                                //         type: 'vertical',
                                //     }
                                // }, ''),
                                // h('A', {
                                //     props: {
                                //         type: 'error',
                                //         size: 'small'
                                //     },
                                //     style: {
                                //         fontSize: '14px',
                                //         color: ifDelete ? 'red' : '#d0d0d0',
                                //         pointerEvents: ifDelete ? '' :  'none'
                                //     },
                                //     on: {
                                //         click: () => {
                                //             this.deleteRow(params.row);
                                //         }
                                //     }
                                // }, '删除')
                            ]);
                        }
                    }
                ],
                infos: [],
                postponeColumns: [
                    {
                        type: 'index',
                        title: '序号',
                        width: 80,
                        align: 'center',
                        fixed: 'left',
                    },
                    {
                        title: '活动名称',
                        align: 'center',
                        key: 'activityName',
                        minWidth: 100,
                        render:(h,params)=>{
                            return h('div',[
                                h('span',params.row.activityName || '--')
                            ]);
                        }
                    },
                    {
                        title: '申请时间',
                        align: 'center',
                        key: 'applyDateStr',
                        minWidth: 150,
                        render:(h,params)=>{
                            return h('div',[
                                h('span',params.row.applyDateStr || '--')
                            ]);
                        }
                    },
                    {
                        title: '整改限定时间（延期前）',
                        align: 'center',
                        key: 'beforeDateStr',
                        minWidth: 200,
                        render:(h,params)=>{
                            return h('div',[
                                h('span',params.row.beforeDateStr || '--')
                            ]);
                        }
                    },
                    {
                        title: '整改限定时间（延期后）',
                        align: 'center',
                        key: 'afterDateStr',
                        minWidth: 200,
                        render:(h,params)=>{
                            return h('div',[
                                h('span',params.row.afterDateStr || '--')
                            ]);
                        }
                    },
                    {
                        title: '延期天数',
                        align: 'center',
                        key: 'days',
                        minWidth: 100,
                        render:(h,params)=>{
                            return h('div',[
                                h('span',params.row.days || '--')
                            ]);
                        }
                    },
                    {
                        title: '申请人',
                        align: 'center',
                        key: 'posname',
                        minWidth: 100,
                        render:(h,params)=>{
                            return h('div',[
                                h('span',params.row.posname || '--')
                            ]);
                        }
                    },
                    {
                        title: '延期原因',
                        align: 'center',
                        key: 'reason',
                        minWidth: 200,
                        tooltip: true,
                        render:(h,params)=>{
                            return h('div',[
                                h('span',params.row.reason || '--')
                            ]);
                        }
                    }
                ],
                infos2: [],
                formData: {
                    days: 1
                },
                ruleCustom: {
                    days: [
                        {
                            type: 'number',
                            required: true,
                            message: '  ',
                            trigger: 'blur,change'
                        }
                    ],
                    reason: [
                        {
                            required: true,
                            message: '  ',
                            trigger: 'blur,change'
                        }
                    ]
                },
                reportFile: [],
                modifyFile:[],
                levelList: [
                    {
                        id: 'Ⅰ',
                        label: 'Ⅰ'
                    },
                    {
                        id: 'Ⅱ',
                        label: 'Ⅱ'
                    },
                    {
                        id: 'Ⅲ',
                        label: 'Ⅲ'
                    },
                    {
                        id: 'Ⅳ',
                        label: 'Ⅳ'
                    }
                ],
                statusList: [
                    {
                        id: '1',
                        label: '审批中'
                    },
                    {
                        id: '2',
                        label: '被驳回'
                    },
                    {
                        id: '3',
                        label: '已消除'
                    },
                ],
                selectRow: {},
                historyColumns: [
                    {
                        type: 'index',
                        title: '序号',
                        width: 80,
                        align: 'center',
                    },
                    {
                        width: 180,
                        title: '审批时间',
                        key: 'endTime',
                        align: 'center',
                    },
                    {
                        width: 185,
                        title: '节点名称',
                        key: 'name',
                        align: 'center',
                    },
                    {
                        width: 120,
                        title: '审批人',
                        key: 'userName',
                        align: 'center'
                    },
                    {
                        width: 100,
                        title: '审批意见',
                        key: 'route',
                        align: 'center'
                    },
                    {
                        width: 200,
                        title: '备注',
                        key: 'opinions',
                        align: 'center'
                    },
                ],
                infos3: [],
                loading4: false,
                userColumns: [
                    {
                        type: 'index',
                        title: '序号',
                        width: 80,
                        align: 'center',
                        fixed: 'left',
                    },
                    {
                        title: '用户名',
                        align: 'center',
                        key: 'loginId',
                        minWidth: 200,
                        render:(h,params)=>{
                            return h('div',[
                                h('span',params.row.loginId || '--')
                            ]);
                        }
                    },
                    {
                        title: '姓名',
                        align: 'center',
                        key: 'userName',
                        minWidth: 200,
                        render:(h,params)=>{
                            return h('div',[
                                h('span',params.row.userName || '--')
                            ]);
                        }
                    },
                    {
                        title: '岗位',
                        align: 'center',
                        key: 'positionName',
                        minWidth: 200,
                        render:(h,params)=>{
                            return h('div',[
                                h('span',params.row.position.positionName || '--')
                            ]);
                        }
                    },
                    {
                        title: '部门',
                        align: 'center',
                        key: 'orgName',
                        minWidth: 200,
                        render:(h,params)=>{
                            return h('div',[
                                h('span',params.row.orgName || '--')
                            ]);
                        }
                    },
                    {
                        title: '操作',
                        align: 'center',
                        key: 'caozuo',
                        fixed: 'right',
                        minWidth: 80,
                        render: (h, params) => {
                            return h('div', [
                                h('A', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        fontSize: '14px'
                                    },
                                    on: {
                                        click: () => {
                                            this.$http.get(Api.getTaskList + '/' + this.selectRow.procinstId, {
                                                params: {}
                                            }).then(function(res){
                                                this.updateAssign(res.data.taskId, this.selectRow.procinstUserId, params.row.userId);
                                            }, function(res){
                                                this.$Message.error('请求失败');
                                            });
                                        }
                                    }
                                }, '选择')
                            ]);
                        }
                    },
                ],
                infos4: []
            }
        },
        mounted(){
            this.tableHeight = window.innerHeight - this.$refs.table.$el.offsetTop - 145;
            let user = sessionStorage('userId').getObject('userId');
            this.rootOrgId =  user.orgInfo.parentId;
            this.formInline.se_date = [new Date(new Date().getFullYear()+'-01-01'), new Date()];
            this.query();
        },
        watch: {
            "modal1":function(qw,er){
                if(!qw){
                    this.formData = {
                        days: 1
                    };
                }
            },
            "modal3":function(qw,er){
                if(!qw){
                    this.imgUrl = '';
                }
            },
        },
        methods: {
            query(){
                this.loading = true;
                let user = sessionStorage('userId').getObject('userId');
                let data = {
                    startPage: this.pagedata.currentPage,
                    pageSize: this.pagedata.pageSize,
                    operatorOrgId: user.companyName
                };
                if(this.formInline.se_date.length!=0){
                    this.formInline.startDate = this.formInline.se_date[0];
                    this.formInline.endDate = this.formInline.se_date[1];
                }
                if(this.formInline.hidLevel!=undefined){
                    let level = '';
                    this.formInline.hidLevel.map((i)=>{
                        level += "'" + i + "',"
                    })
                    this.formInline.level = level.substring(0, level.length - 1);
                }
                data = Object.assign(data,JSON.parse(JSON.stringify(this.formInline)));
                this.$http.get(Api.apsgInverstigation, {
                    params: data
                }).then(function(res){
                    this.infos = res.data.data;
                    this.pagedata.total = res.data.totalSize;
                    this.loading = false;
                }, function(res){
                    this.$Message.error('请求失败');
                });
            },
            cancel(){
                this.formInline = {
                    se_date: []
                };
                // this.$refs.existOrg.resetCurrentOrg();
                this.query();
            },
            pageSizeChange(pageSize){
                this.pagedata.pageSize = pageSize;
                this.query();
            },
            pageChange(pageNum){
                this.pagedata.currentPage = pageNum;
                this.query();
            },
            switchQuery(flag){
                this.switchFlag = flag;
                if(this.switchFlag) {
                    this.tableHeight = this.tableHeight - 74;
                }else{
                    this.tableHeight = this.tableHeight + 74;
                }
            },
            updateRow(row){
                this.$http.get(Api.apsgInverstigation + '/'+ row.id, {
                    params: {}
                }).then(function(res){
                    this.formData = res.data;
                    this.formData.projectname = row.parentOrgName +'>>'+ row.projectname
                }, function(res){
                    this.$Message.error('请求失败');
                });
                this.reportFile = [];
                this.modifyFile = [];
                this.$http.get(Api.uploadPTWFiles  + '/' + row.id + '/files/picture',{
                    params: {},
                }).then((res) => {
                    res.data.data.map((i) =>{
                        if(i.field == 'report'){
                            this.reportFile.push(i);
                        }else if(i.field == 'modify'){
                            this.modifyFile.push(i);
                        }
                    })
                })
            },
            queryPostpone(){
                this.loading2 = true;
                let data = {
                    startPage: this.pagedata.currentPage2,
                    pageSize: this.pagedata.pageSize2,
                    investigationId: this.selectRow.id
                };
                data = Object.assign(data,JSON.parse(JSON.stringify(this.formInline)));
                this.$http.get(Api.ApsgPostpone, {
                    params: data
                }).then(function(res){
                    this.infos2 = res.data.data;
                    this.pagedata.total2 = res.data.totalSize;
                    this.loading2 = false;
                }, function(res){
                    this.$Message.error('请求失败');
                });
            },
            pageSizeChange2(pageSize){
                this.pagedata.pageSize2 = pageSize;
                this.queryPostpone();
            },
            pageChange2(pageNum){
                this.pagedata.currentPage2 = pageNum;
                this.queryPostpone();
            },
            queryHistory(row){
                this.loading3 = true;
                this.$http.get(Api.getHistory + '/' + row.procinstId, {params: {}}).then((res) => {
                    this.infos3 = res.data;
                    this.loading3 = false;
                }).catch(e => {
                    this.$Message.error("数据获取失败")
                })
            },
            setOrgName(data){
                // this.formInline.localityid = data[data.length - 1];
            },
						setOrgName1(data){
						    this.formInline.localityid = data
						},
            saveInfo(){
                this.$refs['formCustom'].validate((valid) => {
                    if(valid){
                        this.buttonLoading = true;
                        let user = sessionStorage('userId').getObject('userId');
                        this.formData.posname = user.userName;
                        this.formData.investigationId = this.selectRow.id;
                        this.formData.activityName = '申请延期';
                        this.formData.beforeDate = this.selectRow.governTime;
                        this.formData.recPeriod = this.selectRow.recPeriod;
                        this.$http.post(Api.ApsgPostpone,this.formData).then(function(response){
                            if(response.data.status == 200){
                                this.$Message.success({content: '保存成功', duration: 4});
                                this.modal1 = false;
                            }else{
                                this.$Message.error({ content: '保存失败', duration: 4});
                            }
                            this.buttonLoading = false;
                            this.query();
                        }, function(response){
                            this.$Message.error({ content: '保存失败', duration: 4});
                            this.buttonLoading = false;
                        });
                    }
                });
            },
            deleteRow(row){
                this.$Modal.confirm({
                    title: '数据删除',
                    content: '<p>确定删除该条信息</p>',
                    okText: '确认',
                    onOk: () => {
                        this.$http.delete(Api.apsgInverstigation, {params:{
                                id: row.id,
                            }}).then((res) => {
                            this.$Message.success({content:'删除成功',duration: 4});
                            this.query();
                        })
                    },
                    cancelText: '取消'
                });
            },
            queryUser(){
                this.loading4 = true;
                let user = sessionStorage('userId').getObject('userId');
                let data = {
                    orgId: user.companyId,
                    fromPage: this.pagedata.currentPage3,
                    pageSize: this.pagedata.pageSize3,
                }
                data = Object.assign(data,JSON.parse(JSON.stringify(this.form2)));
                this.$http.get(Api.queryUser, {
                    params: data
                }).then(res => {
                    res.data.data.map(i => {
                        if(i.orgInfo != null) {
                            i.orgName = i.orgInfo.orgName;
                            i.orgId = i.orgInfo.orgId;
                        }
                    })
                    this.pagedata.total3 = res.data.total;
                    this.infos4 = res.data.data;
                    this.loading4 = false;
                }).catch(e => {
                    this.loading4 = false;
                    this.$Message.error('请求失败');
                })
            },
            pageSizeChange3(pageSize){
                this.pagedata.pageSize3 = pageSize;
                this.queryUser();
            },
            pageChange3(pageNum){
                this.pagedata.currentPage3 = pageNum;
                this.queryUser();
            },
            updateAssign(taskId, oldUserId, newUserId){
                this.$http.get(Api.getAssign + '/' + taskId, {
                    params: {
                        newUserId: newUserId,
                        oldUserId: oldUserId
                    }
                }).then(res => {
                    if(res.data.status == 200){
                        this.$Message.success({content: '委办成功', duration: 4});
                        this.modal4 = false;
                        this.query();
                    }else{
                        this.$Message.error({ content: '委办失败', duration: 4});
                    }
                }).catch(e => {
                    this.loading4 = false;
                    this.$Message.error('请求失败');
                })
            },
            renderCellDateTime(h, params) {
                let key = params.column.key;
                if (!params.row[key]) return "";
                return h('span', formatDate(new Date(params.row[key]), "yyyy-MM-dd hh:mm:ss"))
            },
            loadImg(){

            },
            formatDate(date, fmt) {
                if (typeof date == 'string') {
                    return date;
                }
                if (!fmt) fmt = "yyyy-MM-dd hh:mm:ss";
                if (!date || date == null) return null;
                let o = {
                    'M+': date.getMonth() + 1, // 月份
                    'd+': date.getDate(), // 日
                    'h+': date.getHours(), // 小时
                    'm+': date.getMinutes(), // 分
                    's+': date.getSeconds(), // 秒
                    'q+': Math.floor((date.getMonth() + 3) / 3), // 季度
                    'S': date.getMilliseconds() // 毫秒
                }
                if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length))
                for (let k in o) {
                    if (new RegExp('(' + k + ')').test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length)))
                }
                return fmt
            },
            exportExcel(){
                let user = sessionStorage('userId').getObject('userId');
                let data = {
                    startPage: this.pagedata.currentPage,
                    pageSize: this.pagedata.pageSize,
                    operatorOrgId: user.companyName,
                    attachment: 1
                };
                if(this.formInline.se_date.length!=0){
                    this.formInline.startDate = this.formInline.se_date[0];
                    this.formInline.endDate = this.formInline.se_date[1];
                }
                if(this.formInline.hidLevel!=undefined){
                    let level = '';
                    this.formInline.hidLevel.map((i)=>{
                        level += "'" + i + "',"
                    })
                    this.formInline.level = level.substring(0, level.length - 1);
                }
                data = Object.assign(data,JSON.parse(JSON.stringify(this.formInline)));
                this.isSpin = true;
                this.$http.get(Api.apsgInverstigation + '/excel',{
                    params: data,
                    responseType: 'arraybuffer'
                }).then((res) => {
                    this.isSpin = false;
                    const aLink = document.createElement("a");
                    let blob = new Blob([res.data], {
                        type: "application/vnd.ms-excel"
                    })
                    aLink.href = URL.createObjectURL(blob);
                    aLink.download = "单位隐患("+ formatDate(new Date(), "yyyy-MM-dd")+ ").xlsx" //标题
                    aLink.click();
                    document.body.appendChild(aLink);
                })
            },
            reset() {
                this.form2 = {
                    userName: ''
                };
                this.queryUser();
            },
            querySort({column, key, order}){
              this.formInline.key = key;
              this.formInline.order = order;
              this.query();
            }
        }
    }
</script>
<style lang='css' scoped>
    @import '../../../index.css';
    .demo-spin-icon-load{
        animation: ani-demo-spin 1s linear infinite;
    }
    @keyframes ani-demo-spin {
        from { transform: rotate(0deg);}
        50%  { transform: rotate(180deg);}
        to   { transform: rotate(360deg);}
    }

</style>
